﻿<%@ Page Title="" Language="C#" MasterPageFile="~/AdminCP/Layouts/Admin.Master" AutoEventWireup="true"
    CodeBehind="NewRegisterStatistics.aspx.cs" Inherits="MLM.AdminCP.Pages.StatisticsManager" meta:resourcekey="PageResource1" %>

<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
    
    <asp:Label runat="server" ID="lbnewRegister" Text="New Register Statistics" 
        meta:resourcekey="lbnewRegisterResource1"></asp:Label>
</asp:Content>
<asp:Content ID="Content3" ContentPlaceHolderID="ContentPlaceHolder2" runat="server">
    From <telerik:RadDatePicker ID="StartDate" runat="server" MinDate="2010-01-01" 
        Culture="en-US" FocusedDate="2010-01-01" meta:resourcekey="StartDateResource1">
<Calendar UseRowHeadersAsSelectors="False" UseColumnHeadersAsSelectors="False" ViewSelectorText="x"></Calendar>

<DateInput DisplayDateFormat="M/d/yyyy" DateFormat="M/d/yyyy"></DateInput>

<DatePopupButton ImageUrl="" HoverImageUrl="" CssClass=""></DatePopupButton>
    </telerik:RadDatePicker>
    To <telerik:RadDatePicker ID="EndDate" runat="server" Culture="en-US" 
        meta:resourcekey="EndDateResource1">
<Calendar UseRowHeadersAsSelectors="False" UseColumnHeadersAsSelectors="False" ViewSelectorText="x"></Calendar>

<DateInput DisplayDateFormat="M/d/yyyy" DateFormat="M/d/yyyy" Width=""></DateInput>

<DatePopupButton ImageUrl="" HoverImageUrl="" CssClass=""></DatePopupButton>
    </telerik:RadDatePicker>
    <a href="#" id="btnView" class="button"><asp:Label runat="server" ID="lbView" 
        Text="View" meta:resourcekey="lbViewResource1"></asp:Label></a>
    <div id="divData">
    </div>
    <telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">
        <script type="text/javascript">
            String.prototype.format = function () {
                var text = this;
                var tokenCount = arguments.length;
                if (tokenCount < 1) {
                    return text;
                }
                for (var token = 0; token < tokenCount; token++) {
                    text = text.replace(new RegExp("\\{" + token + "\\}", "gi"), arguments[token]);
                }
                return text;
            };
            function GetOnlyDate(strDate) {
                strDate = strDate.replace("/Date(", "").replace(")/", "");
                var dt = new Date(parseInt(strDate));
                var date = dt.getDate();
                var mon = dt.getMonth() + 1;
                if (date < 10) date = '0' + date;
                if (mon < 10) mon = '0' + mon;
                return "{0}/{1}/{2}".format(date, mon, dt.getFullYear());
            }
            $(function () {

                $("#btnView").click(function (e) {
                    e.stopPropagation();
                    var _endDate = $find("<%=EndDate.ClientID %>").get_selectedDate();
                    var _startDate = $find("<%= StartDate.ClientID %>").get_selectedDate();
                    var x = _startDate.format("MM/dd/yyyy");
                    var y = _endDate.format("MM/dd/yyyy");
                    $.ajax({
                        type: "POST",
                        url: "/AdminCP/Pages/NewRegisterStatistics.aspx/GetListDate",
                        contentType: "application/json; charset=utf-8",
                        dataType: "json",
                        data: "{'startDate':'" + x + "','endDate':'" + y + "'}",
                        async: true,
                        success: function (msj) {
                            msj.d = JSON.parse(msj.d);
                            var listDate = [];
                            $.each(msj.d[0].Date, function (i, item) {
                                listDate.push(GetOnlyDate(item));
                            });
                            if (msj.d.length > 0) {

                                $('#divData').highcharts({
                                    chart: {
                                        type: 'column'
                                    },
                                    title: {
                                        text: 'Statistics New Register By Date'
                                    },
                                    subtitle: {
                                    // text: 'Source: amuro.evismedia.com'
                                },
                                credits: { enabled: false },
                                xAxis: {
                                    categories: listDate
                                },
                                yAxis: {
                                    min: 0,
                                    title: {
                                        text: 'Person'
                                    }
                                },
                                tooltip: {
                                    headerFormat: '<span style="font-size:10px">{point.key}</span><table>',
                                    pointFormat: '<tr><td style="color:{series.color};padding:0">{series.name}: </td>' +
                    '<td style="padding:0"><b>{point.y} Person</b></td></tr>',
                                    footerFormat: '</table>',
                                    shared: true,
                                    useHTML: true
                                },
                                plotOptions: {
                                    column: {
                                        pointPadding: 0.2,
                                        borderWidth: 0
                                    }
                                },
                                series: [{
                                    name: 'New Register',
                                    data: msj.d[0].value
                                }]
                            });
                        }
                    }
                });
                return false;
            });
        });    
        </script>
    </telerik:RadCodeBlock>
</asp:Content>
